//
//  DetailDesc.swift
//  shop
//
//  Created by chen on 2025/5/14.
//

import SwiftUI
import Kingfisher

struct DetailDesc: View {
    
    @ObservedObject var router: Router
    @ObservedObject var vm: DetailViewModel
    
    @State private var extend: Bool = true
    
    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            VStack(alignment: .leading, spacing: 0) {
                HStack(alignment: .firstTextBaseline, spacing: 5) {
                    Text("\(vm.goodsDetail.shopType == 1 ? "天猫" : "淘宝")")
                        .padding(2)
                        .font(.system(size: 12))
                        .bold()
                        .foregroundStyle(.white)
                        .background(Color.red)
                        .cornerRadius(3)
                    
                    Text("\(vm.goodsDetail.title)")
                        .font(.system(size: 16))
                        .foregroundStyle(.black)

                }
                
                HStack(alignment: .lastTextBaseline, spacing: 0) {
                    Text("¥ ")
                        .font(.system(size: 16))
                        .bold()
                        .foregroundStyle(Color.red)
                    
                    Text("\(vm.goodsDetail.actualPrice.formatMoney())")
                        .font(.system(size: 24))
                        .foregroundStyle(.red)
                        .bold()
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .padding(.trailing, 15)
                    
                    Text("原价 ¥\(vm.goodsDetail.originalPrice.formatMoney())")
                        .foregroundStyle(Color.gray)
                        .font(.system(size: 13))
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .strikethrough()
                    
                    
                    Spacer()
                    
                    Text("已售\(vm.goodsDetail.monthSales)")
                        .foregroundStyle(Color.black)
                        .font(.system(size: 13))
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                }
                .padding(.top, 5)
                
                if !vm.goodsDetail.activityInfo.isEmpty {
                    ScrollView(.horizontal, showsIndicators: false) {
                        LazyHStack(spacing: 10) {
                            ForEach(getActiveList(), id: \.activityId) { item in
                                Text("\(item.activityName)")
                                    .padding(5)
                                    .font(.system(size: 12))
                                    .foregroundStyle(.black.opacity(0.7))
                                    .background(Color.detailBg)
                                    .cornerRadius(4)
                            }
                        }
                        .padding(.top, 8)
                    }
                }
            }
            .padding(.vertical, 8)
            .padding(.horizontal, 10)
            .background(.white)
            
            HStack(alignment: .top, spacing: 10) {
                KFImage.url(URL(string: vm.goodsDetail.shopLogo))
                       .loadDiskFileSynchronously()
                       .cacheMemoryOnly()
                       .fade(duration: 0.35)
                       .resizable()
                       .frame(width: 45, height: 45)
                
                VStack(alignment: .leading, spacing: 8) {
                    Text("\(vm.goodsDetail.shopName)")
                        .font(.system(size: 17))
                        .foregroundStyle(Color.black)
                        .bold()
                    
                    Text("店铺等级：\(vm.goodsDetail.shopLevel)")
                        .font(.system(size: 12))
                        .foregroundStyle(Color.black.opacity(0.8))
                    
                    HStack(spacing: 8) {
                        Text("描述: \(vm.goodsDetail.descScore.formatMoney())")
                        Text("物流: \(vm.goodsDetail.shipScore.formatMoney())")
                        Text("服务: \(vm.goodsDetail.serviceScore.formatMoney())")
                    }
                    .font(.system(size: 12))
                    .foregroundStyle(Color.black.opacity(0.8))
                }
                
                Spacer()
                
                Button {
                    router.to(.hotView)
                } label: {
                    Text("热销爆款")
                        .font(.system(size: 12))
                        .padding(3)
                        .foregroundStyle(.white)
                        .background(Color.red)
                        .cornerRadius(5)
                }
                .buttonStyle(PlainButtonStyle())

            }
            .padding(.horizontal, 10)
            .padding(.vertical, 8)
            .background(.white)
            
            VStack(spacing: 0) {
                ZStack{
                    Text("商品详情")
                        .font(.system(size: 16))
                        .foregroundStyle(.black)
                        .bold()
                    
                    HStack(spacing: 0){
                        Spacer()
                        
                        Button {
                            extend.toggle()
                        } label: {
                            HStack(spacing: 2){
                                Text("\(extend ? "收起" : "展开")")
                                    .font(.system(size: 13))
                                    .foregroundStyle(.black)
                                
                                Image(systemName: extend ? "chevron.up.circle" : "chevron.down.circle")
                                    .font(.system(size: 13))
                                    .foregroundStyle(.red)
                            }
                        }
                        .buttonStyle(PlainButtonStyle())
                    }
                }
                .padding(.vertical, 10)
                .padding(.horizontal, 10)
                
                // 商品详情
                if extend {
                    Text("\(vm.goodsDetail.desc)")
                        .font(.system(size: 15))
                        .foregroundStyle(.black)
                        .padding(.bottom, 10)
                        .padding(.horizontal, 10)
                    
                    LazyVStack(spacing: 0){
                        ForEach(getImgs(), id: \.self) { item in
                            KFImage.url(URL(string: item))
                                   .loadDiskFileSynchronously()
                                   .cacheMemoryOnly()
                                   .fade(duration: 0.35)
                                   .resizable()
                                   .aspectRatio(contentMode: .fit)
                        }
                    }
                }
            }
            .background(.white)
        }
    }
    
    private func getImgs() -> [String] {
        return vm.goodsDetail.imgs.components(separatedBy: ",")
    }
    
    private func getActiveList() -> [ActivityInfo] {
        return vm.goodsDetail.activityInfo.isEmpty ? [] : Array(Set(vm.goodsDetail.activityInfo))
    }
}

#Preview {
    ZStack{
        Color.detailBg
            .ignoresSafeArea()
        
        ScrollView{
            DetailDesc(router: Router.shared, vm: DetailViewModel.shared)
        }
    }
    
}
